<template lang="pug">
    skin(@up="up",@down="down",@yes="yes",@back="back",@duringUp="up",@duringDown="down")
        div(class="flex-column h3")
            div(class="flex-column-item flex-row")
                div(class="flex-row-item flex-center-center flex-7")
                    span ---基础率方案---
                div(class="flex-row-item right")
                    span {{activeId + 1}}
                div(class="flex-row-item", style="flex:0")
            div(class="flex-column-item flex-3")
                div(class="flex-row")
                    div(class="flex-row-item flex-6",style="height:100%")
                      div(class="flex-column")
                        div(class="flex-column-item flex-center",v-for="(menu,index) in currentPageMenus")
                            span(class="iconfont",:style="{'visibility': index == currentMenuIndex? 'visible' : 'hidden'}") &#xe62c;
                            span {{menu.name}} - {{menu.amount}}
                    div(class="flex-row-item",style="height:100%")
                        control-line(:total="menus.length",:current="activeId",style="float:right")
</template>

<script>
    import MenuList from '@/mixins/MenuList'
    export default {
        mixins:[MenuList],
        data() {
            return {
                page: { maxResultCount: 3 }
            };
        },
        computed: {
            menus() {
                const planA = this.getPlanTotal(window.rate.planA.value);
                const planB = this.getPlanTotal(window.rate.planB.value);
                const planC = this.getPlanTotal(window.rate.planC.value);
                return [
                    {name: "标准方案", id: 2, amount: planC, to: '/base-rate/plan-detail?plan=C'},
                    {name: "A方案", id: 0, amount: planA, to: '/base-rate/plan-detail?plan=A'},
                    {name: "B方案", id: 1, amount: planB, to: '/base-rate/plan-detail?plan=B'},
                ]
            }
        },

        methods: {
            getPlanTotal(items) {
                let result = 0;
                items.forEach(item => result = (result * 10 + item.value * 10) / 10);
                return result;
            },
            up() {
                this.activeId --;
            },
            down() {
                this.activeId ++;
            },

            back() {
                this.$router.push("/base-rate?index=3");
            },
            yes() {
                this.$router.push(this.currentMenu.to);
            }
        },
        created() {
        }
    };
</script>

<style lang="less">
</style>
